.details {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: white;
  overflow-y: auto;
  z-index: 10;
  .banner {
    height: 180px;
    position: relative;
    .banner-image {
      position: absolute;
      bottom: 0;
      z-index: -1;
      width: 100%;
      height: 260px;
      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }
    .avatar {
      position: absolute;
      bottom: -24px;
      right: 21px;

      overflow: hidden;
      img {
        border-radius: 4px;
      }
    }
  }
  .moments {
    margin-top: 80px;
    .card {
      box-shadow: 0 0.5px 0 var(--border-color);
      padding-bottom: 8px;
      .name {
        color: #596a92;
        font-weight: bold;
      }

    }
  }
  .reviewer {
    background-color: #eeeeee;

    border-radius: 2px;
    .love {
      border-bottom: 1px solid var(--border-color);
    }
    .reviewer-name {
      color: #596a92;
      line-height: 24px;
    }
  }
  .images{
    gap: 4px;
    li{
      max-width: 50%;
    }
    img{
      width: 100%;
      border-radius: 4px;
      object-fit: cover;
      max-height: 160px;
      max-width: 160px;
    }
  }
}
